readonly は論理属性で、存在する場合、要素が変更可能ではなくなり、ユーザーがそのコントロールを編集できなくなります。

readonly 属性が input 要素に指定された場合、その入力欄をユーザーが編集できないので、その要素は制約検証が行われません。

readonly 属性はフォームコントロールの text, search, url, tel, email, password, date, month, week, time, datetime-local, number の 型と 要素が対応しています。これらの入力型や要素のいずれかに設定された場合、 :read-only 擬似クラスが一致します。この属性が含まれなかった場合は、 :read-write 擬似クラスが一致します。

この属性は や、 checkbox や radio のように既に変更不可能な入力型、 file 入力型のように定義上初期状態で値を設定できない入力型は対応していません。 range や color は、どちらも既定値があります。 hidden も、非表示であればユーザーが値を入力することが期待できないので対応していません。ボタン型も、 image を含め、すべて対応していません。

メモ: テキストコントロールだけが読み取り専用にすることができます。他のコントロール (チェックボックスやボタンなど) は、読み取り専用と無効との間に有用な違いがないため、 readonly 属性は適用されません。

入力に readonly 属性が設定されている場合、 :read-only 擬似クラスも適用されます。逆に、 readonly 属性に対応していても、この属性が設定されていない入力欄は、 :read-write 擬似クラスに一致します。